<!-- 我的——个人中心 -->
<template>
	<view class="mine-page">
		<view class="v-bj"></view>
		<view :style="{ height: heightSystemss*2 + 'px' }"></view>
		<view class="flex-align-center v-top" @click="handleLogin()">
			<image :src="user.avatar ? user.avatar : avatarUrl"></image>
			<view class="flex-columns v-name">
				<view>{{ user.nickname ? user.nickname : '点击登录' }}</view>
				<text>{{ user.nickname && user.telphone ? user.telphone : '' }}</text>
			</view>
		</view>

		<view class="detailsContainer flex-around">

			<block v-for="(i, j) in moneyList" :key="j">
				<view class="flex-column v-price" @click="toGo(i)" v-if="j!=1">
					<view style="color: #E7C235;">{{ i.num }}</view>
					<text>{{ i.title }}</text>
				</view>
				<view class="flex-column " @click="toGo(i)" v-else>

					<text style="color: #F0F0F02F;">{{ i.title }}</text>
				</view>
			</block>

		</view>
		<view class="bgGay">
			<block>
				<view class="v-absolute">
					<card :list="orderList" :type="1" title="我的订单" v-if="orderList.length > 0"></card>
					<card :list="groupList" :type="2" title="活动订单" v-if="groupList.length > 0"></card>
					<card :list="typeList" :type="3" title="常用功能" v-if="typeList.length > 0"></card>
				</view>
			</block>

			<view class="bottom-border"></view>
			<!-- 流量主广告 -->
			<advertisement :fix="1" :adId="system.user_app_id" :img="system.user_img" :picType="system.user_type">
			</advertisement>
		</view>
		
		 <sunui-tabbar v-if="brokerageSetObj.is_open==1" :fixed="true" :current="3"></sunui-tabbar>
		  <sunui-tabbar v-else :fixed="true" :current="2"></sunui-tabbar>
	<!-- 	<uv-tabbar :value="value" @change="change">
			<uv-tabbar-item text="首页">
				<template v-slot:active-icon>
					<image style="height: 50rpx; width: 50rpx;" class="icon" src="/static/tabbar/蒙版-1.png"></image>

				</template>
				<template v-slot:inactive-icon>
					<image style="height: 50rpx; width: 50rpx;" class="icon" src="/static/tabbar/蒙版.png"></image>
				</template>
			</uv-tabbar-item>
			<uv-tabbar-item text="活动">
				<template v-slot:active-icon>
					<image style="height: 50rpx; width: 50rpx;" class="icon" src="/static/tabbar/蒙版-3.png"></image>

				</template>
				<template v-slot:inactive-icon>
					<image style="height: 50rpx; width: 50rpx;" class="icon" src="/static/tabbar/蒙版-2.png"></image>
				</template>
			</uv-tabbar-item>
			<uv-tabbar-item text="推广" v-if="brokerageSetObj.is_open == 1">
				<template v-slot:active-icon>
					<image style="height: 50rpx; width: 50rpx;" class="icon" src="/static/tabbar/蒙版-7.png"></image>

				</template>
				<template v-slot:inactive-icon>
					<image style="height: 50rpx; width: 50rpx;" class="icon" src="/static/tabbar/蒙版-6.png"></image>
				</template>
			</uv-tabbar-item>
			<uv-tabbar-item text="我的">
				<template v-slot:active-icon>
					<image style="height: 50rpx; width: 50rpx;" class="icon" src="/static/tabbar/蒙版-5.png "></image>

				</template>
				<template v-slot:inactive-icon>
					<image style="height: 50rpx; width: 50rpx;" class="icon" src="/static/tabbar/蒙版-4.png"></image>
				</template>
			</uv-tabbar-item>

		</uv-tabbar> -->

	</view>
</template>

<script>
	export default {
		data() {
			return {
				system: uni.getStorageSync('system'),
				value: 3,
				mobile: uni.getStorageSync('kfSet').kf_phone,
				avatarUrl: '/static/avatar.png',
				uid: uni.getStorageSync('uid'),
				typeList: [{
						img: '/static/order/image(11).png',
						text: '推广赚钱',
						url: '/pages/partnerPromotion/promotionCenter',
						isTrue: 1
					},
					{
						img: '/static/order/image(10).png',
						text: '我的奖品',
						url: '/pages/myPrize/myPrize',
						// ==0 则分销关闭 isTrue为1展示
						isTrue: uni.getStorageSync('system').distributionSet && uni.getStorageSync('system')
							.distributionSet.distribution_level == 0 ? 2 : 1
					},

					/* {
						img: '/static/my/send.png',
						text: '我的发布',
						url: '/pages/need/mySend',
						isTrue: 1
					}, */
					// 暂无页面
					/* {
						img: '/static/my/myConent4.png',
						text: '商务合作',
						url: '/pages/mine/businessCooperation/businessCooperation'
					}, */
					{
						img: '/static/order/image(9).png',
						text: '客服联系',
						isTrue: 1,

					}
				],

				moneyList: [

					{
						num: 0.00,
						title: '抵用金',
						url: ''

					},
					{

						title: '|',

					},
					{
						num: 0.00,
						title: '佣金',
						url: ''

					}
				],
				// 我的订单
				orderList: [{
						img: '/static/order/image(1).png',
						text: '未付款',
						num: 0.00,
						id: 0
					},
					{
						img: '/static/order/image(7).png',
						text: '已完成',
						num: 0.00,
						id: 1
					},
					{
						img: '/static/order/image(3).png',
						text: '已评价',
						num: 0.00,
						id: 2
					},
					{
						img: '/static/order/image(5).png',
						text: '已开票',
						num: 0.00,
						id: 3
					}
				],
				// 团购订单
				groupList: [{
						img: '/static/order/image(2).png',
						text: '待付款',
						num: 0.00,
						id: 2
					},
					{
						img: '/static/order/image(8).png',
						text: '拼团中',
						num: 0.00,
						id: 3
					},
					{
						img: '/static/order/image(4).png',
						text: '已完成',
						num: 0.00,
						id: 4
					},
					{
						img: '/static/order/image(6).png',
						text: '已开票',
						num: 0.00,
						id: 5
					}
				],
				user: {},
				heightSystemss: 0,
				brokerageSetObj: {}
			};
		},
		onLoad() {
			this.createdgetSystemInfo();
			this.brokerageSetFn()


		},
		onShow() {
			this.uid = uni.getStorageSync('uid');
			this.userInfos();

		},
		methods: {
			change(e) {
				console.log(e)
				if (e == 0) {
					this.$sun.navSwitch('/pages/index/index')
				} else if (e == 1) {
					this.$sun.navSwitch('/pages/activityPgae/activity')
				} else if (e == 2) {
					this.$sun.navSwitch('/pages/partnerPromotion/promotionCenter')
				}
			},

			async brokerageSetFn() {
				const result = await this.$http.get({
					url: this.$api.brokerageSet,
					data: {


					}
				});
				if (result.errno == 0) {



					this.brokerageSetObj = result.data
					uni.setStorageSync('brokerageSet', result.data);
				}
			},
			createdgetSystemInfo() {
				let menuButtonObject = uni.getMenuButtonBoundingClientRect(); //获取菜单按钮（右上角胶囊按钮）的布局位置信息。坐标信息以屏幕左上角为原点。
				uni.getSystemInfo({
					//获取系统信息
					success: res => {
						let navHeight = menuButtonObject.height + (menuButtonObject.top - res
							.statusBarHeight) * 2; //导航栏高度=菜单按钮高度+（菜单按钮与顶部距离-状态栏高度）*2
						this.heightSystemss = navHeight;
					},
					fail(err) {
						console.log(err);
					}
				});
			},
			/* api */
			// 用户信息
			async userInfos() {

				const result = await this.$http.get({
					url: this.$api.userInfo,
					data: {
						// 用户id
						uid: uni.getStorageSync('uid'),
						// 上级id
						// pid: uni.getStorageSync('pid') ? uni.getStorageSync('pid') : ''
						// pid: ''
					}
				});
				if (result.errno == 0) {
					this.user = result.data;
					uni.setStorageSync('user', this.user);
					let linkUrl = '/pages/promotionCenter/promotionCenter';
					this.moneyList = [

						{
							num: this.user.integral,
							title: '抵用金',
							// 暂无详情
							url: this.brokerageSetObj.is_open ? '/pages/distribution/distributionDetails' : ''
						},
						{

							title: '|',

						},
						{
							num: this.user.brokerage,
							title: '佣金',
							// ==0 则分销关闭
							url: this.brokerageSetObj.is_open ? '/pages/distribution/distributionDetails' : ''
						}
					];
					this.orderList = [{
							img: '/static/order/image(1).png',
							text: '未付款',
							num: this.user.dai_count,
							id: 2
						},
						{
							img: '/static/order/image(7).png',
							text: '已完成',
							num: this.user.com_count,
							id: 3
						},
						{
							img: '/static/order/image(3).png',
							text: '已评价',
							num: this.user.pj_count,
							id: 4
						},
						{
							img: '/static/order/image(5).png',
							text: '已开票',
							// num: 5,
							id: 5
						}
					];
					this.groupList = [{
							img: '/static/order/image(2).png',
							text: '待付款',
							num: this.user.tuan_ai_count,
							id: 2
						},
						{
							img: '/static/order/image(8).png',
							text: '拼团中',
							num: this.user.tuan_fu_count,
							id: 3
						},
						{
							img: '/static/order/image(4).png',
							text: '已完成',
							num: this.user.tuan_com_count,
							id: 4
						},
						{
							img: '/static/order/image(6).png',
							text: '已开票',
							num: this.user.tuan_piao_count,
							id: 6
						}
					];
				}
			},
			// 判断登录
			handleLogin() {
				this.uid = uni.getStorageSync('uid');
				console.log(this.uid)
				if (this.uid) {
					return true;
				} else {
					uni.navigateTo({
						url: `/pages/login/login?isRenovate=1`
					});
				}
			},
			/* 点击事件 */
			toGo(i) {
				console.log(i)
				if (this.handleLogin()) {
					if(this.brokerageSetObj.is_open==1){
						if (i.title == '抵用金') {
							this.$sun.navGo(i.url, {
								navTab: 1
							});
						} else {
							this.$sun.navGo(i.url, {
								navTab: 0
							});
						}
					}else{
						
					}
					
				}
			}
		}
	};
</script>

<style lang="less">
	page {
		background-color: #f7f7f7;
	}

	.mine-page {
		.v-bj {
			// background-image: linear-gradient(to right bottom , #499DFD,#0153FF);
			// background-image: linear-gradient(#bae1ff, #ffffff);
			background-image: url('@/static/myimg.jpg');
			background-size: cover;
			position: absolute;
			z-index: -1;
			width: 100%;
			height: 550rpx;
		}

		.detailsContainer {
			width: 707rpx;
			height: 180rpx;
			border-radius: 20rpx 20rpx 0rpx 0rpx;
			margin: 0 22rpx;
			background: rgb(32, 47, 68);
		}

		.bgGay {
			border-radius: 20rpx 20rpx 0rpx 0rpx;

			height: 30vh;

			background: linear-gradient(180.00deg, rgb(255, 255, 255) 38.976%, rgba(255, 255, 255, 0) 100%);
		}

		.v-top {
			padding: 44rpx 34rpx 40rpx;

			image {
				width: 100rpx;
				height: 100rpx;
				border-radius: 50%;
				margin-right: 22rpx;
			}

			.v-name {
				font-size: 32rpx;

				view {
					color: #fff;
				}

				text {
					color: #fff;
					margin-top: 20rpx;
				}
			}
		}

		.v-price {
			color: #fff;
			// margin-bottom: 48rpx;
			width: calc(100% / 3);

			view {
				color: #fff;
				font-size: 40rpx;
				margin-bottom: 22rpx;
			}
		}

		.v-absolute {
			width: 96%;
			position: absolute;
			top: 538rpx;
			left: 50%;
			transform: translateX(-50%);
		}

		.v-bottom-list {
			padding-top: 600rpx;
			// padding-bottom: 20rpx;
			// position: absolute;
			// bottom: 0;
		}
	}
</style>